<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">

    <link rel="stylesheet" th:href="@{../bootstrap/css/bootstrap.min.css}">
    <link rel="stylesheet" th:href="@{../css/font-awesome.min.css}">
    <link rel="stylesheet" th:href="@{../css/main.css}">
    <style>
        .tree li {
            list-style-type: none;
            cursor:pointer;
        }
        table tbody tr:nth-child(odd){background:#F4F4F4;}
        table tbody td:nth-child(even){color: #cc0000;}
        select,option{
            font-size: 20px;
        }

    </style>
</head>

<body>


<div th:replace="../templates/nav"></div>
<div class="container-fluid">
    <div class="row">
        <div th:replace="../templates/menu"></div>
        <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h3 class="panel-title"><i class="glyphicon glyphicon-th"></i>面试添加</h3>
                </div>
                <div class="panel-body">

                    <form class="form-inline" role="form" style="float:left;" id="AddForm">
                        <div class="form-group has-feedback">
                            <input type="hidden" name="sid"  id="sid" th:value="${sid}">
                            <h3 th:text="${student.stname}"></h3>
                            面试结果： <select name="result" id="resultAdd" class="form-control" >
                            <option value="">请选择</option>
                            <option value="通过">通过</option>
                            <option  value="未通过">未通过</option>
                        </select></br></br>
                            面试评价： <textarea cols="50" rows="5" name="judge" id="judgeAdd" placeholder="请填写评价"></textarea>
                            </br>
                            <p> <button type="button" class="btn btn-primary" style="float:right;" onclick="back()"><i class="glyphicon glyphicon-plus"></i> 返回</button>
                                <button type="button" class="btn btn-primary" style="float:right;" onclick="addInterviewDo($('#sid').val())"><i class="glyphicon glyphicon-plus"></i> 保存</button>
                            </p>
                              </div>
                    </form>
                </div>
                    <!--                    <button type="button" class="btn btn-danger" style="float:right;margin-left:10px;" id="btnDelSelected"><i class=" glyphicon glyphicon-remove"></i> 删除</button>-->

                    <hr style="clear:both;">
                    <div class="table-responsive">
                        <h3>历史面试记录</h3>
                            <table class="table  table-bordered">
                                <thead>
                                <tr>

                                    <td width="50px">面试时间</td>
                                    <td width="100px">面试结果</td>
                                    <td width="100px">评价</td>
                                    <td width="100px">操作</td>
                                </tr>
                                <tbody id="tbody"></tbody>

                                </thead>

                                <tfoot>
                                <tr >
                                    <td colspan="4" align="center">
                                        <ul class="pagination" id="byPage">

                                        </ul>
                                    </td>
                                </tr>
                                </tfoot>
                            </table>

                    </div>

            </div>
        </div>
    </div>
</div>






<script th:src="@{../jquery/jquery-2.1.1.min.js}"></script>
<script th:src="@{|/jquery/jquery.md5.js|}"></script>
<script th:src="@{../bootstrap/js/bootstrap.min.js}"></script>
<script th:src="@{../script/docs.min.js}"></script>
<script th:src="@{../layer/layer.js}"></script>


<script type="text/javascript">
    $(function () {
        $(".list-group-item").click(function(){
            if ( $(this).find("ul") ) {
                $(this).toggleClass("tree-closed");
                if ( $(this).hasClass("tree-closed") ) {
                    $("ul", this).hide("fast");
                } else {
                    $("ul", this).show("fast");
                }
            }
        });
        showList(1)


    });


    function showList(currentPage) {
        $.ajax({
            url:"/interview/interviewListDo",
            type:"post",
            data:{"currentPage":currentPage,"pageSize":3,"sid":$("#sid").val()},
            success:function (data) {
                if (data.result){
                    var str="";
                    $.each(data.interviewList, function (index,interview) {

                        str += "<tr>";
                        str += "<td>" + interview.itime + "</td>";
                        str += "<td>" + interview.result + "</td>";
                        str += "<td>" + (interview.judge==""?"未填写":interview.judge)+ "</td>";
                        str += "<td>"
                        str += '<button type="button" title="删除" class="btn btn-danger btn-xs" onclick="deleteinterviewByCid(' + interview.ino+','+$("#sid").val()+ ')"><i class=" glyphicon glyphicon-remove"></i></button>';
                        str +="</td>"
                        str += "</tr>";
                    });
                    $("#tbody").html(str);
                    var pageStr = "";
                    pageStr += '<li class="' + (data.pageBean.currentPage == 1 ? 'disabled' : '') + '"><a href="#" onclick="showList(' + (1) + ')">首页</a></li>';

                    pageStr += '<li class="' + (data.pageBean.currentPage == 1 ? 'disabled' : '') + '"><a href="#" onclick="showList(' + (data.pageBean.currentPage - 1) + ')">上一页</a></li>';
                    for (var i = 1; i <= data.pageBean.countPage; i++) {
                        pageStr += '<li class="' + (data.pageBean.currentPage == i ? 'active' : '') + '"><a href="#" onclick="showList(' + i + ')">' + i + '<span class="sr-only">(current)</span></a></li>';
                    }
                    pageStr += '<li class="' + (data.pageBean.currentPage == data.pageBean.countPage ? 'disabled' : '') + '"><a href="#" onclick="showList(' + (data.pageBean.currentPage==data.pageBean.countPage?data.pageBean.currentPage:data.pageBean.currentPage + 1) + ')">下一页</a></li>';
                    pageStr += '<li class="' + (data.pageBean.currentPage == data.pageBean.countPage ? 'disabled' : '') + '"><a href="#" onclick="showList(' + (data.pageBean.countPage) + ')">末页</a></li>';
                    $("#byPage").html(pageStr);
                } else {
                    layer.msg("数据加载失败", {time: 1000, icon: 5, shift: 6}, function () {
                    });
                }
            }
        });
    }
    function  addInterviewDo(sid){

        var interviewResult= $("#resultAdd").val();
        if(interviewResult==null||interviewResult==""){
            layer.msg("面试结果不能为空", {time: 1000, icon: 5, shift: 6}, function () {
            });
            return;
        }

        $.ajax({
            url: "/interview/addInterviewDo",
            type: "post",
            data:$("#AddForm").serialize(),
            success: function (data) {
                    if(data.result){
                        $("#AddForm")[0].reset();
                        layer.msg("保存成功", {time: 1000, icon: 6, shift: 5}, function () {
                        });
                        showList(1)
                    }else {layer.msg("保存失败", {time: 1000, icon: 5, shift: 6}, function () {
                    });}
            }
        })
    }
    function  back(){
        location.href="/interview/allStudentInterviewList"
    }


    function deleteinterviewByCid(ino,sid){

        layer.confirm('确定删除吗？', {
            btn: ['确定','取消']     //按钮
        }, function(){           //点击确定访问后台
            // 这里写自己的ajax代码
            $.ajax({
                url: "/interview/deleteinterviewByInoDo",
                type: "post",
                data: {"ino":ino},
                success: function (data) {
                    if(data.result){
                        layer.msg('已删除', {
                            time: 1000, //2s后自动关闭
                        });
                       showList(1)
                    }
                }
            })

            //在后台返回结果为失败的函数里面写上下面代码
        }, function(){   	//点击取消则中断操作
            layer.msg('已取消', {
                time: 1000, //2s后自动关闭
            });
        });

    }
</script>
</body>
</html>